<!-- 工单表单 -->

<template>
  <WebForm path="add">
    <MyStep />
    <Step2 v-if="add_one.step === 2" />
    <Step3 v-if="add_one.step === 3" />
  </WebForm>
</template>

<script>
// ============================== 导入依赖 ============================== //

import CORE from '@/CORE'

// ============================== 导出组件 ============================== //

export default {
  /**
   * 名称定义 (实际使用名称)
   */
  name: 'RepairForm',

  /**
   * 混入列表 (配置选项合并)
   */
  mixins: [
    CORE.mixWeb(),
    CORE.mixWeb('add', 'add_'),
    CORE.mixWeb('deal', 'deal_'),
  ],

  /**
   * 组件导入 (Abc.vue + Abc/index.vue)
   */
  ...CORE.components(
    require.context('@admin/views/Maintain/Repair/RepairList/AddModal', true, /vue$/),
    require.context('./', true, /vue$/),
  ),

  /**
   * 监听属性 (深度 deep 首次 immediate)
   */
  watch: {
    /**
     * 监听处理弹窗
     */
    deal_visible: {
      immediate: true,
      handler(visible) {
        if (this.deal_one.dealType !== 1) return
        visible ? this.initRepair() : this.resetRepair()
      },
    },
  },

  /**
   * 本地方法 (轻量重要在前)
   */
  methods: {
    /**
     * 初始化工单
     */
    initRepair() {
      const {
        areaId,
        areaName,
        alarmResType,
        alarmResId: deviceId,
        alarmResName: deviceName,
        alarmDetail: description,
        messageAlarmFileDto: files,
      } = this.one

      const image = files.filter((file) => file.fileType === 1).map(file => file.fileUrl)

      this.add_setOne({ areaId, areaName, deviceId, deviceName, description, image })

      // 以 deviceId 查询关联的 assetId 和 assetName
      if (alarmResType === 1) this.add_startOne()
    },

    /**
     * 重置工单
     */
    resetRepair() {
      this.add_setOne()
      setTimeout(() => this.add_refForm.clearValidate())
    },
  },
}
</script>
